<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="resources/alignment-parsing-utils-th.js"></script>
<html>
 <body>
     <p>Test to verify that the new alignment values do not hit assertions in flexbox layout code.</p>
     <div id="log"></div>

     <div id="flexContainer" style="display: flex">
         <div id="flexItem"></div>
     </div>
<script>

var container = document.getElementById("flexContainer");
var item = document.getElementById("flexItem");

function checkAlignSelfValue(value, computedValue)
{
    item.style.webkitAlignSelf = value;
    checkValues(item, "alignSelf", "align-self", value, computedValue);
}

function checkAlignItemsValue(value, computedValue)
{
    container.style.webkitAlignItems = value;
    checkValues(container, "alignItems", "align-items", value, computedValue);
    checkValues(item, "alignSelf", "align-self", "auto", "auto");
}

function checkSelfAlignmentValues()
{
    item.style.webkitAlignSelf = "flex-start";

    checkAlignSelfValue("unsafe start", "unsafe start")
    checkAlignSelfValue("start", "start")
    checkAlignSelfValue("end", "end")
    checkAlignSelfValue("safe flex-start", "safe flex-start")
    checkAlignSelfValue("self-start", "self-start")
    checkAlignSelfValue("self-end", "self-end")
}

function checkDefaultAlignmentValues()
{
    container.style.webkitAlignItems = "flex-end";
    item.style.webkitAlignSelf = "auto";

    checkAlignItemsValue("unsafe start", "unsafe start")
    checkAlignItemsValue("start", "start")
    checkAlignItemsValue("end", "end")
    checkAlignItemsValue("safe flex-start", "safe flex-start")
    checkAlignItemsValue("self-start", "self-start")
    checkAlignItemsValue("self-end", "self-end")
}

test(function() {
    checkSelfAlignmentValues(true);
}, "New Self-Alignment values should not violate assertions in FlexibleBox layout logic..");

test(function() {
    checkDefaultAlignmentValues(true);
}, "New Default-Alignment values should not violate assertions in FlexibleBox layout logic..");

</script>

</body>
</html>
